<p class="hero">
  <strong>RawGit</strong> serves raw files directly from GitHub with proper <strong>Content-Type</strong> headers.
</p>

<div class="url-helper">
  <div class="url-paste">
    <p id="url-form">
      <label for="url" class="offscreen">GitHub URL:</label>
      <input id="url" class="url" type="url" value="{{url}}"
             placeholder="Paste a GitHub file or gist URL here." autofocus tabindex="1">
    </p>
  </div>

  <div class="column">
    <h2>Use this URL in <strong>production</strong></h2>

    <p class="url-container">
      <input id="url-prod" class="url" placeholder="https://{{config.cdnDomain}}/user/repo/tag/file" readonly tabindex="2">
      <button id="url-prod-copy" class="url-copy-button" data-clipboard-target="#url-prod" title="Copy URL" disabled>
        <img src="{{{assetUrl "/img/clippy.svg"}}}" alt="">
      </button>
    </p>

    <ul>
      <li><p>No traffic limits or throttling. Files are served via <a href="https://stackpath.com/">StackPath</a>'s super fast global CDN.
      <li><p>Use a specific tag or commit hash in the URL (not a branch). Files are cached permanently based on the URL. Query strings are ignored.
      <li><p>The catch: this is a free service, so there are <a href="https://github.com/rgrove/rawgit/blob/master/FAQ.md#i-need-guaranteed-100-uptime-should-i-use-cdnrawgitcom">no uptime or support guarantees</a>.
    </ul>
  </div>

  <div class="column">
    <h2>Use this URL for <strong>development</strong></h2>

    <p class="url-container">
      <input id="url-dev" class="url" placeholder="https://{{config.devDomain}}/user/repo/branch/file" readonly tabindex="3">
      <button id="url-dev-copy" class="url-copy-button" data-clipboard-target="#url-dev" title="Copy URL" disabled>
        <img src="{{{assetUrl "/img/clippy.svg"}}}" alt="">
      </button>
    </p>

    <ul>
      <li><p>New changes you push to GitHub will be reflected within minutes.
      <li><p>Excessive traffic will be throttled and blacklisted.
      <li><p>If excessive traffic continues, RawGit will display a prominent error message on your website to try to get your attention.
    </ul>
  </div>
</div>

<script>
var cdnDomain = '{{config.cdnDomain}}';
var devDomain = '{{config.devDomain}}';
</script>

<script src="https://cdn.rawgit.com/cdnjs/cdnjs/0971b44/ajax/libs/fetch/2.0.1/fetch.min.js"></script>
<script src="https://cdn.rawgit.com/zenorocha/document.queryCommandSupported/v1.0.0/dist/queryCommandSupported.min.js"></script>
<script src="https://cdn.rawgit.com/zenorocha/clipboard.js/v1.5.10/dist/clipboard.min.js"></script>
<script src="{{{assetUrl "/js/url-formatter.js"}}}"></script>
